<template>
	<view>
		<!-- pages/index/index.wxml -->

		<!-- 头部 -->
		<navber id="head-navber" :navbarData="navbarData"></navber>
		<view class="is-novip" v-if="userInfo.member_level < 1">
			<view v-if="status=='no'">
				<img src="https://yinjia.oss-cn-beijing.aliyuncs.com/haizili/bean_bg.png" alt="">
			</view>
			<view v-else>
				<view class="is-novip-tag">需要购买商品升级到会员才能参与使用该功能</view>
				<view class="is-novip-btn" @click="onGoIndex">立即去升级</view>
			</view>
		</view>
		<view class="is-vip-tag" v-if="userInfo.member_level >= 1">
			<!-- banner -->
			<view class="store" v-if="selected == 'store'">
				<view class="goods-list">
					<!-- 商品-全部 -->
					<goods :isEnd="goodsEnd" :goodsList="dataList" :bean="'bean'"></goods>
					<view class="end"></view>
				</view>
			</view>

			<view class="gift" v-if="selected == 'gift'">
				<view class="goods-list">
					<goods :isEnd="goodsGiftEnd" :goodsList="giftList" :bean="'gift'"></goods>
					<view class="end"></view>
				</view>
			</view>

			<view class="bean" v-if="selected == 'bean'">
				<view class="item-head-view">
					<image :src="imgUrl + '/imgs/user/profit/bac.png'" class="item-head-img"></image>
					<view class="item-head-com">
						<view class="item-head" @click="onGoBean()">
							<view class="item-head-name">我的趣豆</view>
							<view class="item-head-value">{{gameBean}}</view>
						</view>
						<view class="item-head" @click="onGoCoupon()">
							<view class="item-head-name">我的兑换券</view>
							<view class="item-head-value">{{gameCoupon}}</view>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGoGame()">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/game.png'"></image>
					</view>
					<view class="option-item-text">抽礼盒</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text">剩余抽盒次数 {{gameRem}} 次</view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGoCard(1)">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/card.png'"></image>
					</view>
					<view class="option-item-text">我的卡片</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text">{{gameCard}}张</view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGoCard(2)">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/gift.png'"></image>
					</view>
					<view class="option-item-text">我的礼盒</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text">{{gameBox}}个</view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGoOrder()">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/order.png'"></image>
					</view>
					<view class="option-item-text">我的订单</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text"></view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGameEarnings()">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/pop1.png'"></image>
					</view>
					<view class="option-item-text">我的收益</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text"></view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<view class="option-item" @click="onGamePop(1)">
					<view class="option-item-img">
						<image :src="imgUrl + '/imgs/game/pop2.png'"></image>
					</view>
					<view class="option-item-text">我的团队</view>
					<view class="option-item-tip">
						<view class="option-item-tip-text"></view>
						<view class="option-item-img-more">
							<image :src="imgUrl + '/imgs/select-right.png'"></image>
						</view>
					</view>
				</view>
				<!-- <view class="item-list">
					<view class="item-list-node item-list-node1" @click="onGoCard(1)">
						<view class="item-list-node-card">
							<view class="card-name">卡片</view>
							<view class="card-val">{{gameCard}}</view>
						</view>
					</view>
					<view class="item-list-node item-list-node2" @click="onGoCard(2)">
						<view class="item-list-node-card">
							<view class="card-name">礼盒</view>
							<view class="card-val">{{gameBox}}</view>
						</view>
					</view>
					<view class="item-list-node item-list-node3" @click="onGoOrder()">
						<view class="item-list-node-card">
							<view class="card-name">订单</view>
							<view class="card-val">{{gameOrder}}</view>
						</view>
					</view>
					<view class="item-list-node item-list-node4" @click="onGoBean()">
						<view class="item-list-node-card">
							<view class="card-name">预计收益</view>
							<view class="card-val">{{gameEarnings}}</view>
						</view>
					</view>
					<view class="item-list-node item-list-node6" @click="onGoGame()">
						<view class="item-list-node-card">
							<view class="card-name">盲盒</view>
							<view class="card-val"> </view>
						</view>
					</view>
				</view> -->
				<!-- <view class="item-list">
					<view class="item-bean-node item-bean-node1" @click="onGamePop(1)">
						<view class="item-bean-node-card">
							<view class="card-name">我的直推</view>
							<view class="card-val"> </view>
						</view>
					</view>
					<view class="item-bean-node item-bean-node2" @click="onGamePop(2)">
						<view class="item-bean-node-card">
							<view class="card-name">我的团队</view>
							<view class="card-val"> </view>
						</view>
					</view>
				</view> -->
			</view>

			<view class="store-tab" id="store-tab">
				<view class="tab-item" @tap="onSelect(item.type)" v-for="(item, index) in tablist" :key="index">
					<view class="tab-item-img">
						<image
							:src="imgUrl + '/imgs/store/' + item.type + (selected == item.type ? '-sel' : '') + '.png'">
						</image>
					</view>
					<view :class="'tab-item-text tab-item-text-' + (selected == item.type ? 'selected' : '')">
						{{ item.name }}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import navber from '@/components/navber/index';
	import goods from '@/components/goods/index';
	import mytab from '@/components/mytab/index';
	import cardItem from "@/components/card/index";

	// pages/index/index.js
	const app = getApp();
	const Api = require('../../api/index.js');
	const Config = require('../../config/index.js');

	export default {
		components: {
			navber,
			goods,
			mytab,
			cardItem
		},
		data() {
			return {
				navbarData: {
					title: '流量补贴' //顶部标题
				},
				//导航栏
				imgUrl: Config.imgUrl,
				//图片url
				goods_type: 0,
				card_type: 1,
				//banner
				selects: '0',
				//标签选中值
				imgUrl: Config.imgUrl,
				//图片url
				dataList: [],
				giftList: [],
				//列表数据
				pagenow: 1,
				//是否会员
				isIphonex: app.globalData.isIphoneX,
				stickyTop: app.globalData.stickyTop,
				goodsEnd: 'start',
				goodsGiftEnd: 'start',
				labelList: [],
				tablist: [{
						name: '综合商城',
						type: 'store'
					},
					{
						name: '趣豆专区',
						type: 'gift'
					},
					{
						name: '趣味盲盒',
						type: 'bean'
					}
				],
				selected: 'store',
				typeList: [],
				//登录状态
				loginStatus: false,
				//用户信息
				userInfo: {
					nick_name: '',
					code: '',
					head_img: false,
					level_name: '',
					member_level: 0,
					popularize_code: ''
				},
				status: "no",
				gameCoupon: 0,
				gameBean: 0,
				gameCard: 0,
				gameBox: 0,
				gameOrder: 0,
				gameEarnings: 0,
				gameFreeze: 0,
				gameRem: 15,
			};
		},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onLoad: function(option) {
			this.getList();
		},
		onShow: function() {
			uni.hideTabBar();
			this.getUserData();
			if (this.selected == 'bean') {
				this.getGameCore();
			}
		},
		onUnload() {
			uni.showTabBar();
		},
		onHide() {
			uni.showTabBar();
		},
		onPullDownRefresh: function() {
			this.getList();
			this.getUserData();
			if (this.selected == 'bean') {
				this.getGameCore();
			}
			uni.stopPullDownRefresh();
		},
		onReachBottom: function(e) {
			if (this.selected == 'store') {
				//滚动底部
				this.getDataList();
			}
		},
		methods: {
			goodsDetail(e) {
				// 商品详情
				uni.navigateTo({
					url: '/pages/goodsDetail/index?id=' + e.currentTarget.dataset.id
				});
			},
			onGoIndex() {
				//返回首页
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			onGoCoupon() {
				//我的兑换券
				uni.navigateTo({
					url: '/pages/store/coupon/index'
				})
			},
			onGoBean() {
				//我的趣豆
				uni.navigateTo({
					url: '/pages/store/bean/index'
				});
			},
			onGoCard(type) {
				//卡片、礼盒
				uni.navigateTo({
					url: '/pages/store/card/index?class=' + type
				});
			},
			onGoOrder() {
				//订单详情
				uni.navigateTo({
					url: '/pages/user/order/index?goods_type=2'
				});
			},
			onGoGame() {
				//参与盲盒
				uni.navigateTo({
					url: '/pages/store/game/index'
				});
			},
			onGameEarnings() {
				//我的收益明细
				uni.navigateTo({
					url: '/pages/store/earnings/index'
				});
			},
			onGamePop(type) {
				// console.log(type);
				//推广团队
				uni.navigateTo({
					url: '/pages/store/popularize/index?type=' + type
				});
			},
			onTab(e) {
				//切换底部导航
				this.goods_type = e.detail.index;
				this.getDataList(true);
			},
			//切换类型
			onSelect(type) {
				this.selected = type;
				if (type == 'store') {

					this.navbarData.title = "综合商城";
				}
				if (type == 'bean') {
					this.getGameCore();
					this.navbarData.title = "趣味盲盒";
				}
				if (type == 'gift') {
					this.getGitfList();
					this.navbarData.title = "趣豆专区";
				}
			},
			userLogin() {
				//用户登录
				// #ifdef MP-WEIXIN
				uni.navigateTo({
					url: '/pages/login/index'
				});
				// #endif
				// uni.navigateTo({
				// 	url: '/pages/login/index'
				// });
				// #ifndef MP-WEIXIN
				uni.navigateTo({
					url: '/pages/login/phone/index'
				})
				// #endif

			},
			//获取
			getDataList(is_update = false) {
				let that = this;
				if (is_update) {
					that.pagenow = 1;
					that.dataList = [];
				}
				var datas = {
					type_id: this.typeList[this.goods_type].id,
					page: this.pagenow,
					limit: 50
				};
				Api.gameGoodsIndex(datas).then((res) => {
					if (res.data.list.length > 0) {
						var data = this.dataList;
						data = data.concat(res.data.list);
						var page = this.pagenow + 1;
						this.setData({
							dataList: data,
							pagenow: page
						});
					} else {
						this.setData({
							goodsEnd: 'end'
						});
					}
				});
			},
			getGitfList(is_update = false) {
				let that = this;
				if (is_update) {
					that.giftList = [];
				}
				var datas = {
					page: 1,
					limit: 20
				};
				Api.gameGoodsGift(datas).then((res) => {
					if (res.data.list.length > 0) {
						var data = res.data.list;
						this.setData({
							giftList: data
						});
					} else {
						this.setData({
							goodsGiftEnd: 'end'
						});
					}
				});
			},
			getList() {
				var json = {};
				Api.gameGoodsType(json).then((res) => {
					this.setData({
						typeList: res.data
					});
					this.getDataList(true);
				});
			},
			getGameCore() {
				//盲盒中心
				var json = {};
				Api.getGameCore(json).then((res) => {
					if (res.code == 1) {
						this.setData({
							gameCoupon: res.data.coupon,
							gameBean: res.data.bean,
							gameCard: res.data.card,
							gameBox: res.data.box,
							gameOrder: res.data.order,
							gameRem: res.data.rem
						});
					}
				});
			},
			//获取用户数据
			getUserData() {
				Api.userCore({
					type: 'user'
				}).then((res) => {
					if (res.code == 1 && res.data) {
						this.setData({
							loginStatus: res.data.is_login,
							userInfo: res.data.userInfos,
							member_level: res.data.userInfos.member_level,
							status: res.data.status
						});
						if(res.data.userInfos.member_level < 1){
							if (res.data.status == 'no') {
								uni.showTabBar();
							}
						}
						let top_user_id = res.data.userInfos.top_user_id;

						if (parseInt(top_user_id) == 0) {
							this.setData({
								inviteShow: true
							});
						}
						app.globalData.popularize_code = res.data.userInfos.popularize_code;
						app.globalData.userInfo = res.data.userInfos;
					} else {
						this.setData({
							loginStatus: false,
							userInfo: {
								member_level: 0
							},
							member_level: 0
						});
						app.globalData.popularize_code = "";
						app.globalData.userInfo = {
							member_level: 0
						};
					}
				});
			},

			user_order(e) {
				//订单列表
				uni.navigateTo({
					url: '/pages/user/order/index?type=' + e.currentTarget.dataset.type
				});
			},
			user_bean() {
				//趣豆记录
				uni.navigateTo({
					url: '/pages/store/bean/index'
				});
			},
			user_card() {
				//卡盒记录
				uni.navigateTo({
					url: '/pages/store/card/index'
				});
			}
		}
	};
</script>
<style>
	@import './index.css';
</style>
